// mixins.js
import { ref, onMounted, onUnmounted } from 'vue';

export const tableMixin = () => {
    const tableRef = ref(null);
    const tableHeightMinxins = ref(0);

    const updateTableHeight = () => {
        if (tableRef.value) {
            let tableDom = tableRef.value.$el || tableRef.value;
            let top = tableDom.getBoundingClientRect().top;
            console.log('top',tableDom,top);
            
            let bottom = 80;
            tableHeightMinxins.value = window.innerHeight - top - bottom;
        }
    };

    onMounted(() => {
        updateTableHeight();
        window.addEventListener('resize', updateTableHeight);
    });

    onUnmounted(() => {
        window.removeEventListener('resize', updateTableHeight);
    });

    return {
        tableRef,
        tableHeightMinxins,
    };
};
